<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>04.v-on的简化写法</title>
</head>
<body>
<div id="app">
    <h2>name:{{username}}</h2>
    <h2>age:{{age}}</h2>
    <!--<button type="button" v-on:click="agePlus">点我改变年龄</button>-->
    <button type="button" @click="agePlus">点我改变年龄</button>
</div>
<script src="js/vue.js"></script>
<script>
    const app = new Vue({
        el:"#app",  //element 用来给Vue实例定义一个作用范围
        data:{      //用来给Vue实例定义一些相关数据
            username:"mike",
            age:15
        },
        methods:{   //methods用来定义vue的事件
            //agePlus:function () {}
            agePlus(){
                this.age++;
            }
        }
    });
</script>
</body>
</html>